<breadcrumb />

<mat-card>
  <mat-card-content>
    <section>
      <h2>Loading indicator (Indeterminate progress spinner)</h2>
      <mat-spinner color="indeterminate" [strokeWidth]="1" aria-label="Loading" />
      <mat-spinner color="accent" aria-label="Loading" />
    </section>

    <section>
      <h2>Portion of pizza eaten (Determinate progress spinner)</h2>
      <mat-progress-spinner
        [strokeWidth]="1"
        color="primary"
        [value]="portionValue"
        aria-label="Portion of pizza eaten"
      />
      <mat-progress-spinner
        color="warn"
        [value]="portionValue"
        aria-label="Portion of pizza eaten"
      />
    </section>
  </mat-card-content>
</mat-card>
